<template>
  <!-- 评价问答 -->
  <div class="warpc">
    <div class="assess">
      <div class="oneline">
        <div class="onelinef">评价（13557）</div>
        <van-icon name="arrow" @click="fun1()" />
      </div>
      <!-- <div class="content">
        <div>口味赞（135）</div>
        <div>装修精美（105）</div>
        <div>口服务好（95）</div>
        <div>分量大（42）</div>
        <div>愿意再来（43）</div>
        <div class="cp">上菜慢（23）</div>
        <div>菜质精美（17）</div>
        <div>食材新鲜（16）</div>
        <div>位置好找（16）</div>
      </div> -->
      <div class="pjcont">
        <div class="left">
          <img src="mayingshuang/imgs/women.jpg" alt="" />
        </div>
        <div class="right">
          <div class="pjname">兔子</div>
          <div class="data">发布于9月24日</div>
          <div class="startdf">
            打分
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
          </div>
          <p class="page">
            来西安，第一个想到的就是不夜城，国庆第一天见了许久没见的同事，一起游玩了不夜城，人山人海，不亚于上海的南京路，也有很多灯光秀，看的眼花缭乱，两侧也有很多古玩，街上很多汉服之类的，很有范，可惜那天没看到演出，下次再去。
          </p>
          <div class="pjpic">
            <img src="mayingshuang/imgs/huangdeng.jpg" alt="" />
            <img src="mayingshuang/imgs/buyecheng3.jpg" alt="" />
            <!-- <img src="mayingshuang/imgs/dawanmian.jpg" alt="" /> -->
          </div>
        </div>
      </div>
      <div class="pjcont">
        <div class="left">
          <img src="mayingshuang/imgs/jingdian.jpg" alt="" />
        </div>
        <div class="right">
          <div class="pjname">小雨点</div>
          <div class="data">发布于9月24日</div>
          <div class="startdf">
            打分
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
            <img class="start" src="mayingshuang/imgs/star.jpg" alt="" />
          </div>
          <p class="page">
            夜景还是很好看的，虽然现在有点小过气，里面的特色小吃还是可以尝试的~
          </p>
          <div class="pjpic">
            <!-- <img src="mayingshuang/imgs/hua.jpg" alt="" /> -->
            <!-- <img src="mayingshuang/imgs/yongxingmen.jpg" alt="" /> -->

            <!-- <img src="chenkong/imgs/swipe/1/p3.jpg" alt="" /> -->
            <!-- <img src="chenkong/imgs/swipe/1/p4.jpg" alt="" /> -->
          </div>
        </div>
      </div>
      <div class="line"></div>
      <div class="us" @click="funus()">
        <div class="oneline">
          <div class="onelinef">问大家（6）</div>
          <van-icon name="arrow" />
        </div>
        <div class="tw">
          <div class="ask">
            <div class="askle">
              <span class="ques">问</span>
              <span class="conask">我想问一下各位美眉，到底要不要门票啊？</span>
            </div>
            <span class="askre">18 个回答</span>
          </div>
          <div class="ask">
            <div class="askle">
              <span class="ques">问</span>
              <span class="conask">晚上十点还有东西可以看嘛？</span>
            </div>
            <span class="askre">3 个回答</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
// import { shoplistCK } from "../../../api/chenkong.js";
import axios from "axios";

export default {
  data() {
    return {
      obj: [],
    };
  },
  methods: {
    funus() {
      this.$router.push("/evaluate");
    },
    fun1() {
      this.$router.push("/EvaluationDetails");
    },
  },
  created() {
    let i = this.$route.query.i;
    axios.request("http://localhost:8889/shoplistCK").then(({ data }) => {
      this.obj = data[i];
    });
  },
};
</script>

<style lang="scss" scoped>
.warpc {
  width: 100%;
  .assess {
    margin-top: 3.733vw;
    line-height: 6.4vw;
    width: 90%;
    margin: auto;
    // background: green;
    .oneline {
      margin-top: 3.733vw;

      display: flex;
      justify-content: space-between;
      .onelinef {
        font-size: 3.733vw;
        font-weight: 700;
      }
    }
    // .content {
    //   margin-top: 4.267vw;
    //   display: flex;
    //   flex-wrap: wrap;
    //   justify-content: space-around;
    //   div {
    //     text-align: center;
    //     width: 31%;
    //     color: #fc6841;
    //     border: 0.267vw solid #fc6841;
    //     font-size: 2.667vw;
    //     line-height: 5.333vw;
    //     margin-bottom: 2.133vw;
    //     border-radius: 1.333vw;
    //   }
    //   .cp {
    //     border: 0.267vw solid #6683c7;
    //     color: #6683c7;
    //   }
    // }
    .pjcont {
      display: flex;
      justify-content: space-around;
      padding-bottom: 2.133vw;
      border-bottom: 0.267vw solid #f7f7f7;
    }
    .left {
      img {
        width: 10.667vw;
        border-radius: 50%;
        height: 10.933vw;
      }
    }
    .right {
      margin-left: 1.6vw;
      font-size: 2.667vw;
      .pjname {
        color: #899396;
      }
      .data {
        color: #999999;
      }
      .startdf {
        img {
          width: 3.733vw;
          vertical-align: middle;
        }
      }
      .page {
        overflow: hidden;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
      }
      .pjpic {
        margin-top: 2.667vw;
        img {
          width: 26.667vw;
          height: 18.4vw;
        }
      }
    }
    .line {
      width: 100%;
      height: 2.133vw;
      background: #f6f6f6;
    }
    .tw {
      margin-top: 1.333vw;
      .ask {
        font-size: 3.2vw;
        display: flex;
        justify-content: space-between;
        .ques {
          background: #fc6841;
          padding: 0.533vw;
          color: #f6f6f6;
        }
        .conask {
          padding-left: 2.133vw;
        }
        .askre {
          color: #999999;
        }
      }
    }
  }
}
</style>